<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SomeTools-ip查询</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <link rel='icon' href='../image/ICO.ico' type='image/x-ico' />
    <link rel="stylesheet" href="./IpSearchStyle.css">
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>


</head>

<body>
    <div id="body">
        <span id="title">ip地址查询</span><br>
        <span id="cip"></span><br>
        <span id="cname"></span><br><br><br>
        <div class="input-group mb-3">

            <input type="text" class="form-control" placeholder="输入你想查询的ip" aria-label="Recipient's username" aria-describedby="basic-addon2">
            <div class="input-group-append">
                <button id="inputIp" onclick="outputInfoFun()" class="btn btn-outline-secondary" type="button">查询</button>
            </div>
        </div>
        <div>
            <div class="card card-body">
                <span id="location"></span><br>
                <span id="lon"></span><br>
                <span id="lat"></span>
            </div>
        </div>
        <script type="text/javascript">
            $.getScript("http://pv.sohu.com/cityjson", () => {
                let cip = returnCitySN["cip"];
                let cname = returnCitySN["cname"];
                $("#cip").html('当前ip：' + cip);
                $("#cname").html('当前地址：' + cname);
            });

            //http://ip-api.com/json/219.159.159.146?lang=zh-CN

            function* ipSearch() {
                let inputIp = yield $("#inputIp").val();
                yield axios.get(`http://ip-api.com/json/${inputIp}?lang=zh-CN`);
            }

            function outputInfoFun() {
                let showIpInfon = ipSearch();
                let info = showIpInfon.next().value;
                showIpInfon.next(info).value.then(res => {
                    let infoJson = res.data;
                    console.log(infoJson);
                    let outputInfo = {
                        regionName,
                        lat,
                        lon
                    } = infoJson;
                    $("#location").html('IP地址信息：' + regionName);
                    $("#lon").html('经度：' + lon);
                    $("#lat").html('纬度：' + lat);
                });
            }


            let a = {
                as: "AS4134 CHINANET-BACKBONE",
                city: "大丰",
                country: "中国",
                countryCode: "CN",
                isp: "Chinanet",
                lat: 23.7248,
                lon: 108.808,
                org: "Chinanet GX",
                query: "219.159.159.146",
                region: "GX",
                regionName: "广西壮族自治区",
                status: "success",
                timezone: "Asia/Shanghai",
                zip: ""
            }
        </script>
    </div>


</body>

</html>